//home accordions
jQuery('.accordion-list > li > .answer').hide();
jQuery('.accordion-list > li').click(function() {
    if (jQuery(this).hasClass("active")) {
        jQuery(this).removeClass("active").find(".answer").slideUp();
    } else {
        jQuery(".accordion-list > li.active .answer").slideUp();
        jQuery(".accordion-list > li.active").removeClass("active");
        jQuery(this).addClass("active").find(".answer").slideDown();
    }
    return false;
});

//tabs content
jQuery('.tabs-container div').hide().first().show();
jQuery('.tabs-container ul li a').first().addClass('active');
jQuery('.tabs-container ul li a').click(function(e) {
    e.preventDefault();
    const tab_id = jQuery(this).attr('href');
    jQuery('.tabs-container ul li a').removeClass('active');
    jQuery(this).addClass('active');
    jQuery('.tabs-container div').hide();
    jQuery(tab_id).show();
})


const b = jQuery(".home-cat-btn");
b.on("click", function () {
    const e = jQuery(this).attr("id");
    const index = e.charAt(3);
    b.removeClass("active");
    jQuery(this).addClass("active");

    $.ajax({
        type: 'POST',
        url: zb.ajax_url,
        data: {
            'action': 'get_posts_by_index_on_homepage',
            'nonce':zb.ajax_nonce,
            'index': index
        },
        success: function(response) {
            if(response.data){
                fillHomeWithDiv(response.data);
            }
        },
        error: function() {
            console.error('AJAX request failed.');
        }
    });
})

function fillHomeWithDiv (data) {
    var posts_row = jQuery("#ajax-posts-row");
    posts_row.empty();

    var html = '';
    data.forEach(function(item) {
        html += `<div class="col">`;
        html += `<article class="post-item item-grid">`;
        html += `<div class="tips-badge position-absolute top-0 start-0 z-1 m-2"></div>`;
        html += `<div class="entry-media ratio ratio-3x2">`;
        html += `<a target="" class="media-img lazy bg-cover bg-center entered loaded" href="${item.post_permalink}" title="${item.post_title}" data-bg="${item.featured_image}" data-ll-status="loaded" style="background-image: url(${item.featured_image});">`;
        html += `</a></div><div class="entry-wrapper"><div class="entry-cat-dot"><a href="http://riprov2.test/category/plugins/seo">SEO</a><a href="http://riprov2.test/category/plugins">插件</a></div>`;
        html += `<h2 class="entry-title"><a target="" href="${item.post_permalink}" title="Elementor Pro Page Builder 3.17.0">${item.post_title}</a></h2>`;
        html += `<div class="entry-desc">Elementor PRO is a great way to show off...</div><div class="entry-meta">`;
        html += `<span class="meta-date"><i class="far fa-clock me-1"></i><time class="pub-date" datetime="2023-10-28T14:04:38+08:00">4天前</time></span>`;
        html += `<span class="meta-likes d-none d-md-inline-block"><i class="far fa-heart me-1"></i>0</span>`;
        html += `<span class="meta-fav d-none d-md-inline-block"><i class="far fa-star me-1"></i>0</span>`;
        html += `<span class="meta-views"><i class="far fa-eye me-1"></i>1</span>`;
        html += `</div></div></article></div>`;
    });
    posts_row.append(html);
}